import React from 'react';
import { LaptopOutlined, NotificationOutlined, UserOutlined } from '@ant-design/icons';
import { Outlet } from 'react-router-dom'
import { Breadcrumb, Layout, theme } from 'antd';
import SliderMenu from '../compontents/common/sliderMenu/SliderMenu';
import CrumbBase from '../compontents/common/crumb/CrumbBase';
import useSessionStorage from '@/hooks/useSessionStorage';
const { Header, Content } = Layout;
const VisitorIndex: React.FC = () => {
    const [matches, setMathes] = useSessionStorage('matches')
    // const {
    //     token: { colorBgContainer },
    // } = theme.useToken();
    const updateMathes = (arr:any[]) => {
        setMathes(arr)
    }
    return (
        <Layout>
            <Header className="header">
                <div className="logo">logo</div>
                <div className="logout">退出</div>
                {/* <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['2']} items={items1} /> */}
            </Header>
            <Layout>
                {/* 左边菜单 */}
                <SliderMenu updateMathes={updateMathes} />
                <Layout style={{ padding: '0 24px 24px' }}>
                {/* 面包屑 */}
                 <CrumbBase matches={matches} />   
                    <Content
                        style={{
                            padding: 24,
                            margin: 0,
                            minHeight: 280,
                            // background: colorBgContainer,
                        }}
                    >
                        <Outlet></Outlet>
                    </Content>
                </Layout>
            </Layout>
        </Layout>
    );
};

export default VisitorIndex;
